import { createApp } from "vue";
// import './style.css'
import App from "./App.vue";
import Demo from "@/components/Demo.vue";
import Title from "@/components/Title.vue";

// createApp 每个 Vue 应用都是通过 createApp 函数创建一个新的 应用实例
const app = createApp(App);
// 1、注册一个全局组件
app.component("Demo", Demo);
app.component("Title", Title);

// 2、注入全局数据
app.provide("message", "我是注入全局的数据");

// 注册全局指令 (实现DOM操作。不能注册全局过滤器)

// 3、安装一个插件。
// app.use(插件)
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
app.use(ElementPlus);

// app.mixin()
// 应用一个全局mixin（适用于应用程序的范围）。一个全局的mixin会作用于应用中每个组件实例
import { AllMixins } from "./utils/mixins";
app.mixin(AllMixins);

// 全局的样式
import "@/styles/index.scss";

// 引入路由
import { router } from "@/router";
app.use(router); //注册路由

// 使用pinia
import { createPinia } from "pinia";
app.use(createPinia());

// 过滤器
import moment from "moment"; // 日期插件
app.config.globalProperties.$filters = {
  timeFormat(value?: any, str?: any) {
    if (!value) return value;
    str = str || "YYYY-MM-DD HH:mm:ss";
    // console.log(value)
    return moment(value).format(str);
  },
  dateFormat(value?: any, str?: any) {
    if (!value) return value;
    str = str || "YYYY-MM-DD ";
    // console.log(value)
    return moment(value).format(str);
  },
  telformat(value?: any, str?: any) {
    if (!value) return "";
    str = str || "-";
    value = value.toString().split("");
    // console.log(value)
    value.splice(3, 0, str);
    value.splice(8, 0, str);
    return value.join("");
  },
};

app.mount("#app");
